<template>
  <div style="border-radius: 4px;margin: 20px;">
    <div width="100%">
      <h1 align="center">月度制造费成本报表</h1>
    </div>
    <div align="center" style="margin: 40px;" class="filter-container filter1">
      <el-radio-group v-model="radio.direction">
        <el-radio label="chilun">齿轮车间</el-radio>
        <el-radio label="hanjie">焊接车间</el-radio>
      </el-radio-group>
      <el-date-picker
        v-model="value2"
        type="month"
        style="margin-left: 2%"
        placeholder="选择月">
      </el-date-picker>
      <el-button v-waves class="filter-item" style="width: 100px;margin-left: 2%" type="primary"  @click="handleClick" icon="el-icon-search">
        搜索
      </el-button>
    </div>
    <el-table
      :data="tableData"
      border
      style="width: 100%;"
    >
      <el-table-column
        prop="sum"
        label="设备折旧(按上班时间算)"
        width="180"
      />
      <el-table-column
        prop="check_product"
        label="设备电能消耗成本"
      />
      <el-table-column
        prop="sum"
        label="水电消耗成本"
      />
      <el-table-column
        prop="sum"
        label="提交单位"
      />
      <el-table-column
        prop="sum"
        label="设备辅料(刀具等)成本"
      />
      <el-table-column
        prop="sum"
        label="返修成本"
      />
      <el-table-column
        prop="sum"
        label="废品损失成本"
      />
      <el-table-column
        prop="sum"
        label="加工人工成本"
      />
      <el-table-column
        prop="sum"
        label="合计"
      />
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value2: '2019-10',
      radio: {
        drawer: false,
        direction: 'chilun'
      },
      options: [{
        value: '选项1',
        label: '齿轮车间'
      }, {
        value: '选项2',
        label: '焊接车间'
      }],
      tableData: [{
        status: '合格数',
        process: [1, 2, 3],
        sum: '500',
        check_product: '25'
      }, {
        status: '不良品数',
        process: [1, 2, 3],
        sum: '500',
        check_product: '25'
      }, {
        status: '合格率',
        process: [1, 2, 3],
        sum: '500',
        check_product: '25'
      }]
    }
  },
  methods: {
    handleClick() {
      this.$message('这是一条消息提示')
    }
  }
}

</script>
